﻿{% extends 'base.html' %}
{% load staticfiles %}

{% block title %}关于 - 哆唻咪启蒙乐园{% endblock %}

{% block custom_content %}
    <section class="page-title center">
        <div class="container">
            <h2>about us</h2>
            <ul>
                <li><a href="{% url 'main:index' %} }}">主页</a></li>
                <li><a href="#">关于我们</a></li>
            </ul>
        </div>
    </section>

    <section class="about">
        <div class="container">

            <div class="row">
                <div class="single-column col-md-6 col-sm-12">
                    <div class="wow fadeIn" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <div class="post-content">
                            <div class="section-title">
                                <h2>Welcome TO <span>Doremi</span></h2>
                            </div>
                            <div class="text">
                                <p>我们是一家0-3岁的幼儿培育教育中心，有一群热情、活泼、自然、开朗、能歌善舞，喜欢小朋友的团队们。</p>
                            </div>
                            <ul class="list">
                                <li>教育局批准的标准化幼儿教学基地</li>
                                <li>丰富的教学资源，优质的教育理念</li>
                                <li>成熟的健康安全保卫工作</li>
                            </ul>
                            <div class="link">
                                <a href="{% url 'main:about' %}" class="read-more">了解更多</a>
                                <a href="#" class="read-more">加入我们</a>
                            </div>
                        </div>
                    </div>


                </div>
                <div class="single-column col-md-6 col-sm-12">
                    <div class="wow fadeInRight" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <figure class="img-box">
                            <a href="#"><img src="../static/images/resource/1.png" alt=""></a>
                        </figure>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="about-2 no-padd-top">
        <div class="container">

            <div class="row">
                <div class="column col-md-4 col-sm-6">
                    <div class="wow fadeIn animated" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <div class="item center">
                            <div class="icon"><span class="icon-school"></span></div>
                            <div class="content">
                                <h4><a href="#">互动教学</a></h4>
                                <p>亲子课堂使我们的必备课程</p>
                                <a href="#" class="readmore">Read more</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="column col-md-4 col-sm-6">
                    <div class="wow fadeIn animated" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <div class="item center">
                            <div class="icon"><span class="icon-paint-1"></span></div>
                            <div class="content">
                                <h4><a href="#">学前教育</a></h4>
                                <p>教育做到最好的幼小衔接</p>
                                <a href="#" class="readmore">Read more</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="column col-md-4 col-sm-6">
                    <div class="wow fadeIn animated" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <div class="item center">
                            <div class="icon"><span class="icon-blocks"></span></div>
                            <div class="content">
                                <h4><a href="#">双语课程</a></h4>
                                <p>众多优秀的外教老师，更专业的外语教学</p>
                                <a href="#" class="readmore">Read more</a>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <div class="see-more">
            <div class="container">
                <div class="text-center">
                    <div class="link">
                        <a href="#" class="theme-btn btn-style-one">加入我们</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="feature style-2">
        <div class="container">
            <div class="section-title center pb-60">
                <h2>我们的<span>优势</span></h2>
            </div>
            <div class="row">

                <div class="column col-md-4 col-sm-12">
                    <div class="item left1">
                        <div class="icon"><span class="icon-food"></span></div>
                        <h4><a href="#">午餐供应</a></h4>
                        <p>我们有着高品质的实物供应，完全符合教育局标准</p>
                    </div>
                    <div class="item left1">
                        <div class="icon"><span class="icon-blocks"></span></div>
                        <h4><a href="#">双语课程</a></h4>
                        <p>我们有着众多优秀外教老师</p>
                    </div>
                    <div class="item left1">
                        <div class="icon"><span class="icon-school"></span></div>
                        <h4><a href="#">接送上下学</a></h4>
                        <p>我们有着标准化的校车来护送小朋友有安全上下学</p>
                    </div>
                </div>
                <div class="column col-md-4 col-sm-12">
                    <div class="wow fadeIn" data-wow-duration="2s" data-wow-delay="0.5s" data-wow-offset="0"
                         style="visibility: visible; animation-duration: 2s; animation-delay: 0.5s; animation-name: fadeIn;">
                        <figure class="img-box">
                            <a href="#"><img src="{% static 'images/resource/13.png' %}" alt=""></a>
                        </figure>
                    </div>
                </div>
                <div class="column col-md-4 col-sm-12">
                    <div class="item left2">
                        <div class="icon"><span class="icon-library"></span></div>
                        <h4><a href="#">全天课程安排</a></h4>
                        <p>让孩子们能学习到好多新知识</p>
                    </div>
                    <div class="item left2">
                        <div class="icon"><span class="icon-paint-1"></span></div>
                        <h4><a href="#">充分的教学资源</a></h4>
                        <p>我们有着丰富的多媒体教学资源</p>
                    </div>
                    <div class="item left2">
                        <div class="icon"><span class="icon-gestures"></span></div>
                        <h4><a href="#">顶尖的教师团队</a></h4>
                        <p>我们有着顶尖的教师团队，他们有着丰富的幼儿教育资源</p>
                    </div>

                </div>

            </div>
        </div>
    </section>
    <section class="sponser-section pdt-40 style-3">
        <div class="container">
            <div class="section-title center">
                <h2>我们的 <span>合作伙伴</span></h2>
                <p>以下都是专业的教育教学机构</p>
            </div>
            <ul class="sponsors-slider">
                <li><a href="#"><img src="{% static 'images/sponsors/1.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/2.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/3.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/4.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/5.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/6.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/1.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/2.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/3.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/4.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/5.png' %}" alt=""></a></li>
                <li><a href="#"><img src="{% static 'images/sponsors/6.png' %}" alt=""></a></li>
            </ul>
        </div>
    </section>

    <section class="two-column style-3">
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-sm-12 tab-column">
                    <div class="section-title">
                        <h2>我们关心 <span>孩子们</span>的</h2>
                    </div>
                    <div class="outer-box">
                        <ul class="tab-list" role="tablist">
                            <li class="item active hvr-bubble-bottom" data-tab-name="Education">
                                <a href="#Education" aria-controls="Education" role="tab" data-toggle="tab"
                                   class="clearfix">
                                    教育
                                </a>
                            </li>
                            <li class="item hvr-bubble-bottom" data-tab-name="Activities">
                                <a href="#Activities" aria-controls="Activities" role="tab" data-toggle="tab"
                                   class="clearfix">
                                    活动
                                </a>
                            </li>
                            <li class="item hvr-bubble-bottom" data-tab-name="Painting">
                                <a href="#Painting" aria-controls="Painting" role="tab" data-toggle="tab"
                                   class="clearfix">
                                    绘画
                                </a>
                            </li>
                            <li class="item hvr-bubble-bottom" data-tab-name="Games">
                                <a href="#Games" aria-controls="Games" role="tab" data-toggle="tab" class="clearfix">
                                    玩乐
                                </a>


                        </ul>
                    </div>

                    <div class="content-column tab-content">
                        <div class="inner-box tab-pane fade in active " id="Education">
                            <div class="content">
                                <h2>优质的教育资源 </h2>
                                <p>让孩子们能更开心的学习新知识</p>
                                <a href="#" class="link">Read More</a>
                            </div>
                        </div>
                        <div class="inner-box tab-pane fade " id="Activities">
                            <div class="content">
                                <h2>丰富的活动 </h2>
                                <p>丰富的活动让孩子们开心每一天</p>
                                <a href="#" class="link">Read More</a>
                            </div>
                        </div>
                        <div class="inner-box tab-pane fade " id="Painting">
                            <div class="content">
                                <h2>绘画锻炼想象力</h2>
                                <p>带领小朋友遨游绘画世界，释放他们的天性</p>
                                <a href="#" class="link">Read More</a>
                            </div>
                        </div>
                        <div class="inner-box tab-pane fade " id="Games">
                            <div class="content">
                                <h2>玩乐是孩子们的天性</h2>
                                <p>在玩乐中学习。在玩乐中成长</p>
                                <a href="#" class="link">Read More</a>
                            </div>
                        </div>

                    </div>
                </div>
                {% if  feedbacks %}
                    <div class="col-md-4 col-sm-12 testimonial">
                        <div class="section-title">
                            <h2><span>家长们</span>说</h2>
                        </div>
                        <div class="testimonial-slide">
                            {% for feedback in feedbacks %}
                                <div class="item center">
                                    <img src="{{ feedback.image.url }}" width="90" height="80" alt="">
                                    <div class="img-ifo">
                                        <div class="text">
                                            <p>{{ feedback.content }}</p>
                                            <p>{{ feedback.content }}</p>
                                            <p>{{ feedback.content }}</p>
                                        </div>
                                        <div class="rating">
                                            <span class="star fa fa-star"></span>
                                            <span class="star fa fa-star"></span>
                                            <span class="star fa fa-star"></span>
                                            <span class="star fa fa-star"></span>
                                            <span class="star fa fa-star"></span>
                                        </div>
                                        <div class="link">
                                            <a href="#" class="btn-style-one">{{ feedback.name }}</a>
                                        </div>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                {% endif %}
            </div>


        </div>
    </section>

{% endblock %}
